<!--
 * @Description: In User Settings Edit
 * @Author: your name
 * @Date: 2019-08-05 15:16:04
 * @LastEditTime: 2020-03-11 16:44:53
 * @LastEditors: Please set LastEditors
 -->
<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport"
        content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>Hello APP</title>
    <link rel="stylesheet" type="text/css" href="../css/vant.css">
    <link rel="stylesheet" type="text/css" href="../css/base.css" />
    <script type="text/javascript" src="../script/jquery.js"></script>
    <script type="text/javascript" src="../script/layer/mobile/layer.js"></script>
    <script type="text/javascript" src="../script/vue.min.js"></script>
    <script type="text/javascript" src="../script/vant.min.js"></script>
    <script type="text/javascript" src="../script/fastclick.js"></script>
    <script type="text/javascript" src="../script/base.js"></script>
    <script type="text/javascript" src="../script/db.js"></script>
    <script type="text/javascript" src="../script/JSLINQ.js"></script>
    <style type="text/css">
        .content {
            background: #fff !important;
        }

        .row-1 {
            padding: 10px 0;
        }

        .row-2 {
            margin-bottom: 10px;
            padding-bottom: 10px;
            border-bottom: 1px solid #ebedf0;
        }

        .row-2>div {
            position: relative;
        }

        .ch {
            width: 60px;
            height: 45px;
            text-align: center;
            border-right: 1px solid #cd1b21;

        }

        .num {
            color: #cd1b21;
            height: 27px;
            font-weight: 700;
            font-size: 14px;
            line-height: 27px;
        }

        .total {
            font-size: 13px;
            color: #969799;
        }

        .ch-p {
            position: absolute;
            top: 0;
            left: 60px;
            right: 0;
            bottom: 0;
            white-space: nowrap;
        }

        .ch-p-n {
            display: inline-block;
            font-size: 0;
            text-align: center;
            min-width: 60px;
            border-right: 1px solid #ebedf0;
        }

        .ch-p .ch-p-n:last-child {
            border-right: 0;
        }

        .ch-p-n * {
            vertical-align: middle;
            font-size: 14px;
        }

        .cb {
            width: 26px;
        }

        table {
            width: 100%;
        }

        .checkbox {
            position: relative;
            text-align: center;
        }

        .checkbox-mask {
            position: absolute;
            left: 0;
            top: 0;
            right: 0;
            bottom: 0;
        }

        .van-cell__title {
            max-width: none;
        }

        .van-cell__value {
            text-align: right;
        }

        .delete {
            color: #cd1b21;
            font-size: 12px;
        }

        .input {
            padding: 0 0 0 10px;
            margin: 0;
            border: 0;
            width: 100%;
            height: 26px;
            text-align: center;
        }

        .van-dialog {
            width: 320px;
        }
        
    </style>
</head>

<body>
    <div id="app" v-cloak>
        <div class="init-full">
            <van-nav-bar class="head" :title="title + '(' + totalNum + ')'" left-arrow @click-left="onClickLeft">
                <div slot="right" class="head-right">
                    <span @click="openScan" v-if="type == 1">
                        <img src="../image/scan.png" />
                    </span>
                    <span @click="addProduct" v-if="type == 1">
                        <img src="../image/addRow.png" />
                    </span>
                </div>
            </van-nav-bar>
            <div class="body-no-bottom">
                <div class="content">
                    <div class="report" style="background: transparent;">
                        <div class="table-full">
                            <table>
                                <tr>
                                    <th>{{type==1?'操作':'补货'}}</th>
                                    <th>层号</th>
                                    <th>列号</th>
                                    <th>车型</th>
                                    <th>商品名称</th>
                                    <th>数量</th>

                                </tr>
                                <tr v-for="(row,index) in dataList">
                                    <td class="td_center" v-if="type == 1" @click="deleteRow(row,index)">
                                        <img src="../image/delete_row.png" style="width: 20px;" />
                                    </td>
                                    <td class="td_center" @click="cancelCheckBox(row)" v-if="type == 2">
                                        <div class="checkbox">
                                            <van-checkbox v-model="row.checked" style="display: inline-block;">
                                            </van-checkbox>
                                            <div class="checkbox-mask" v-if="!row.checked"
                                                @click.stop="openPopup(row,index)"></div>
                                        </div>

                                    </td>
                                    <td class="td_center">{{row.HJ_CH}}</td>
                                    <td class="td_center">{{row.HJ_LH}}</td>
                                    <td class="td_center">{{row.CXName}}</td>
                                    <td class="td_center">{{row.ProductName}}</td>
                                    <td class="td_center" style="width: 120px;padding: 0;">
                                        <div v-if="type == 1">
                                            <input type="number" class="input" v-model="row.BNum" />
                                        </div>
                                        <div v-if="type == 2">{{row.BNum}}</div>
                                    </td>

                                </tr>
                            </table>
                        </div>

                    </div>
                </div>
                <van-loading v-if="showLoading" />
            </div>
        </div>

        <van-popup v-model="isEditNum" round position="bottom">
            <div>
                <van-cell :title="selectData.ProductName">
                    <div>
                        <van-stepper v-model="selectData.num" min="1" :max="9999"></van-stepper>
                    </div>
                </van-cell>
                <van-cell title="编号" :value="selectData.ProductCode"></van-cell>

            </div>
            <div class="btn-padding">
                <van-button type="primary" block @click="selectConfirm">确定</van-button>
            </div>
        </van-popup>
    </div>
</body>

<script type="text/javascript">
    var vm;
    apiready = function () {
        //$('.init-full').show();

        api.addEventListener({
            name: 'selectArray'
        }, function (ret, err) {
            var selectType = ret.value.selectType;
            var array = ret.value.array;
            if (selectType == 60) {
                var newArray = [];
                for (var i in array) {
                    var row = array[i];
                    newArray.push({
                        HJ_CH: api.pageParam.c,
                        HJ_LH: api.pageParam.l,
                        CXName: vm.title,
                        ProductName: row.name,
                        ProductID: row.id,
                        BNum: 1
                    })
                }
                vm.dataList = vm.dataList.concat(newArray);
            }
        })

        // var filterData = api.pageParam.filterData;
        // var dataList = api.pageParam.dataList.sort(function(a,b){
        //     return b.ProductName  < a.ProductName
        // });
        var dataList = JSLINQ(api.pageParam.dataList).OrderBy("x=>x.ProductName").ToArray();
        var checkArray = api.pageParam.checkArray;
        var type = api.pageParam.type;
        var title = api.pageParam.title;
        var isShopping = api.pageParam.isShopping || false;
        var userInfo = FLD.getUserInfo();
        var FNScanner = api.require('FNScanner');
        vm = new Vue({
            el: '#app',
            data: {
                showLoading: false,
                type: type,
                isShopping:isShopping,
                // filterData:filterData,
                title: title,
                dataList: [],
                isEditNum: false,
                editIndex: -1,
                selectData: [],
                totalNum:0

            },
            created: function () {
                this.getList();
            },
            methods: {
                addProduct() {
                    var that = this;
                    var obj = {
                        S_Type: 60,
                        S_Cont: '',
                        S_BranchID: userInfo.S_BranchID,
                        S_SXZ: '',
                        S_StockID: userInfo.S_StockID,
                        S_CargoID: userInfo.S_CargoID,
                        S_BarCode: '',
                        S_PriceN: 0,
                        S_ProductID: 0
                    }
                    api.openWin({
                        name: '筛选60',
                        url: 'common/baseMultipleScreen.html',
                        reload: true,
                        slidBackEnabled: false,
                        pageParam: {
                            filterData: obj,
                            type: 0
                        }
                    })
                },
                getList() {
                    var that = this;

                    if (that.type == 2) {
                        for (var i in dataList) {
                            var x = 0;
                            for (var j in checkArray) {
                                if (dataList[i].ProductCode == checkArray[j].ProductCode) {
                                    x = 1;
                                    dataList[i].checked = true;
                                }
                            }
                            if (x == 0) {
                                dataList[i].checked = false;
                            }
                        }
                    }


                    that.dataList = dataList;
                    var t = 0;
                    for(var i in that.dataList){
                        t+=that.dataList[i].BNum;
                    }
                    that.totalNum = t;
                },
                openScan() {
                    var that = this;

                    
                    FNScanner.open({
                        autorotation: true
                    }, function (ret, err) {
                        api.setScreenOrientation({
                            orientation: 'landscape_left'
                        })
                        if (ret) {
                            if (ret.eventType == 'success') {
                                var obj = {
                                    S_Type: 60,
                                    S_Cont: '',
                                    S_BranchID: userInfo.S_BranchID,
                                    S_SXZ: '',
                                    S_StockID: userInfo.S_StockID,
                                    S_CargoID: userInfo.S_CargoID,
                                    S_BarCode: ret.content,
                                    S_PriceN: 0,
                                    S_ProductID: 0
                                }
                                FLD.ajax('AP_BasList', obj, function (res) {
                                    if (res.ds.length == 0) {
                                        layer.open({
                                            content: '当前二维码未查询到商品!',
                                            skin: 'msg',
                                            time: 2
                                        });
                                        return false;
                                    }
                                    var row = res.ds[0];

                                    vm.dataList.push({
                                        HJ_CH: api.pageParam.c,
                                        HJ_LH: api.pageParam.l,
                                        CXName: vm.title,
                                        ProductName: row.name,
                                        ProductID: row.id,
                                        BNum: 1
                                    })




                                })
                            }
                        } else {
                            layer.open({
                                content: '扫描失败!',
                                skin: 'msg',
                                time: 2
                            });

                        }
                    });
                    // api.setScreenOrientation({
                    //     orientation: 'portrait_up'
                    // })
                },
                deleteRow(row, index) {
                    var that = this;
                    that.$dialog.confirm({
                        title: '提示',
                        width: '320px',
                        closeOnClickOverlay: true,
                        message: '是否确认删除'
                    }).then(() => {
                        that.dataList.splice(index, 1);
                    }).catch(() => {

                    });

                },
                cancelCheckBox(row) {
                    var that = this;
                    api.sendEvent({
                        name: 'updateCheckArray',
                        extra: {
                            type: 'delete',
                            row: row
                        }
                    });
                },
                selectConfirm() {
                    var that = this;
                    that.dataList[that.editIndex].checked = true;
                    api.sendEvent({
                        name: 'updateCheckArray',
                        extra: {
                            type: 'add',
                            row: that.selectData
                        }
                    });
                    that.isEditNum = false;
                    that.editIndex = -1;
                },
                openPopup(row, index) {
                    var that = this;
                    var data = JSON.parse(JSON.stringify(row));
                    data.num = 1;
                    that.selectData = data;
                    that.isEditNum = true;
                    that.editIndex = index;
                },
                onClickLeft() {
                    var that = this;
                    if (that.type == 1) {
                        api.sendEvent({
                            name: 'refreshDataList',
                            extra: {
                                dataList: that.dataList
                            }
                        });
                    }
                    api.closeWin();
                }
            }
        })
    };
</script>

</html>